<template>
  <div>
    <div v-if="!repoUrl">loading</div>
    <div v-else>most start repo is <a :href="repoUrl">{{repoName}}</a></div>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  name: 'App',
  data(){
    return{
      repoUrl:'',
      repoName:'',
      result_:{}
    }
  },
  mounted() {
    /*发送ajax请求获取数据*/
    // const url = 'https://api.github.com/search/repositories?q=${this.searchName}&sort=stars'
    const url = 'https://api.github.com/search/repositories?q=$v&sort=stars'
    /*this.$http.get(url).then(
      response => {
        const result = response.data;
        const mostRepo = result.items[0];
        this.repoUrl = mostRepo.html_url;
        this.repoName = mostRepo.name;
      },response => {
        alert('请求失败')
      }
    );*/

    /*使用axios请求*/
    axios.get(url).then(response => {
      const result = response.data;
      const mostRepo = result.items[0];
      this.repoUrl = mostRepo.html_url;
      this.repoName = mostRepo.name;
    }).catch(error => {
      alert(error)
    })
  }
}
</script>

<style>

</style>
